<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!doctype html>
<html>
<head>
	<title>客户录单</title>
	<meta name="decorator" content="default"/>
	<script src="${ctxStatic}/layer/layer.js"></script>
	<script src="${ctxStatic}/js/utils/Jutils.js"></script>
	<script type="text/javascript">
		function  autoAdaptHeight() {
			$(".form-contanier").each(function (index,dom) {
				var autoHeight=$(this).closest(".item-box-center").outerHeight(true);
				$(this).css("height",autoHeight);
				$(this).closest(".item-box").find(".item-box-title").each(function (index,dom) {
					$(dom).css("height",autoHeight).css("line-height",autoHeight+"px");
				});
				$(this).closest(".item-box").find(".item-box-right").each(function (index,dom) {
					$(dom).css("height",autoHeight).css("line-height",autoHeight+"px");
				})
			});
		}
	$(function () {
        //layer.config({offset: ['300px', '100px']});
        function  reloadMaterial() {
			var param={};
			param["memberId"]=$("#memberId").val()||"";
            param["view"]=true;
			$("#material_upload").load("${ctx}/sys/material/materialType/memberMaterialUploadList",param,function () {
				autoAdaptHeight();
			});
		}
		function  reloadLoanType() {
			var param={};
			param["memberId"]=$("#memberId").val()||"";
			$("#loanTypeList").load("${ctx}/sys/member/member/loanTypeList",param);
		}
		function  reloadloan() {
			var param={};
			param["memberId"]=$("#memberId").val()||"";
			$("#loanList").load("${ctx}/sys/member/member/loanList",param);
		}

		function bindEvents(){
            //设置客户经理弹窗
            $(".choose-manager").click(function () {
               layer.open({
                    type: 2,
                    title: '选择客服人员',
                    shadeClose: true,
                    shade: 0,
                    area: ['45%', '78%'],
                    content: '${ctx}/sys/member/member/load/userList' //iframe的url
                });
            });
            $("body").on("click"," .add-apply",function () {
                var memberName=$("#memberName").val()||"";
                var loanId=$(this).data("id");
                var loanName=$(this).data("name");
                var apply_item_box=$("#apply_item_box");
                apply_item_box.find("#loan_name span").text(loanName||"").attr("data-loadid",loanId||"");
                apply_item_box.find("#member_name").text(memberName||"");
            });
            $("body").on("change","#bank_select",function () {
                var selectId=$("#bank_select").val();
                $.ajax({
                    type : "POST",  //提交方式
                    url : "${ctx}/sys/member/member/getLoanByBankId",//路径
                    data : {"bankId":selectId},//数据，这里使用的是Json格式进行传输
                    success : function(data) {//返回数据根据结果进行相应的处理
                        $("#loan_select").html("");
                        if(data){
                            for(var i = 0; i < data.length; i++){
                                var loan=data[i];
                                if(i==0){
                                    $("#loan_select").append('<option selected="selected" value="'+loan.id+'">'+loan.name+'</option>')
                                }else{
                                    $("#loan_select").append('<option value="'+loan.id+'" >'+loan.name+'</option>')
                                }
                            }
                        }else{
                            $("#loan_select").html("<option selected='selected'>暂无数据</option>");
                        }
                        $("#loan_select").val("").trigger("change");
                    }
                });
            });
            $("body").on("click"," .do-apply",function () {
                var param={};
                var memberLoanLimit=$("input[name='memberLoanLimit']").val();
                var loanId=$("#loan_select").val();
                var loanName= $("#loan_select").find("option:selected").text();
                var customServiceId=$("#managerId").val();
            /*    if(!memberLoanLimit){
                    parent.layer.alert("请输入贷款金额");
                    return;
                }*/
            /*    var exp = /^([1-9][\d]{0,7}|0)(\.[\d]{1,2})?$/;
                if(!exp.test(memberLoanLimit)){
                    parent.layer.alert("请输入正确的贷款金额");
                    return;
                }*/
                /*if(!loanId){
                    parent.layer.alert("选择贷款产品");
                    return;
                }
                if(!loanName){
                    parent.layer.alert("选择贷款产品");
                    return;
                }*/
                if(!customServiceId){
                    parent.layer.alert("请选择客服人员");
                    return;
                }
                param["memberLoanLimit"]=memberLoanLimit;
              //  param["loanid"]=loanId;
            //    param["name"]=loanName;
                param["memberid"]=$("#memberId").val()||"";
                param["memberName"]=$("#memberName").val()||"";
                param["memberPhone"]=$("#memberPhone").val()||"";
                param["customServiceId"]=customServiceId||"";
                $.ajax({
                    type : "POST",  //提交方式
                    url : "${ctx}/sys/loan/customPay/saveApply",//路径
                    data : param,//数据，这里使用的是Json格式进行传输
                    success : function(data) {//返回数据根据结果进行相应的处理
                        if(data){
                            layer.alert("贷款申请提交成功！",function () {
                                window.location.href="${ctx}/sys/member/member/";
                            });
                        }else{
                            layer.alert("操作失败",-1);
                        }
                    }
                });
            });

		}
		bindEvents();
		reloadMaterial();
		//reloadLoanType();
		//reloadloan();

	});
	</script>
	<style>
		.infoRow-title{
			float: left;
			width: 78px;
			color: #999;
			height: 40px;
		}
		.infoRow-content{
			float: left;
			height: 40px;
		 }
		.dgDetail-infoRow{
			overflow: hidden;
		}
		.dgDetail-section-infoInner{
			padding: 15px;
		}
        .label-title{color: #999;font-size: 15px;margin-right: 13px;width: 80px}
        .label-text{font-size: 15px;margin-right: 13px;}
        #apply_list{
            padding: 10px;
        }
        #apply_item_box div{
            padding: 10px 0;
        }

	</style>
</head>
<body style="text-align: center">
<ul class="nav nav-tabs">
	<li ><a href="${ctx}/sys/member/member/">用户信息列表</a></li>
	<shiro:hasPermission name="sys:member:member:edit"><li class="active"><a >客户录单</a></li></shiro:hasPermission>
</ul>
<input type="hidden" id="memberId" value="${member.id}">
<input type="hidden" id="memberPhone" value="${member.username}">
<input type="hidden" id="memberName" value="${member.nickname}">
<sys:message content="${message}"/>
<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>

<div style="min-height: 100px; margin-top: 10px;overflow: hidden;padding: 5px">
	<div style="width: 450px;float: left;border: 1px solid #fae1c6">
        <div id="apply_list">
            <div id="apply_item_box">
                <div> <label class="label-title">贷款客户：</label>	<label id="member_name">${member.username}</label></div>
                <%--<div><label class="label-title">贷款产品：</label>	<label class="label-text" id="loan_name"><span style="color: red">(*请在下面表格中选择合适的贷款产品！)</span></label></div>--%>
                <div><label class="label-title">备注：</label>	<label class="label-text" id="remark"><input type="text" style="width: 120px" placeholder="备注说明" name="remarks" /></label></div>
                <div> <label class="label-title">贷款金额：</label> <input type="text" style="width: 100px" placeholder="单位（万元）" name="memberLoanLimit" /><%--<span style="color: red">万元（*必填）</span>--%></div>
                <div> <label class="label-title">客服人员：</label>
                    <input type="hidden" id="managerId" />
                    <input type="text"  id="managerName"  class=" required" readonly="true"/>
                    <a href="javascript:void(0)" class="btn btn-primary choose-manager">选择</a><span class="help-inline"><font color="red">*</font> </span>
                </div>
                <div style="padding-top: 10px;"> <label class="label-title">渠道银行：</label>
                    <select id="bank_select"  style="min-width: 111px">
                        <option value="">==请选择==</option>
                        <c:forEach items="${banks}" var="bank">
                            <option value="${bank.id}">${bank.name}</option>
                        </c:forEach>
                    </select>
                    <label class="label-title" style="width: 80px;">贷款产品：</label>
                    <select id="loan_select" style="min-width: 111px">
                        <option value="">==请选择==</option>
                    </select>
                </div>
                <br/>
                <div class="form-actions">
                    <%--	<shiro:hasPermission name="sys:member:member:edit"><input id="btnSubmit" class="btn btn-primary" type="submit" value="客户录单"/>&nbsp;</shiro:hasPermission>--%>
                      <a href="javascript:void(0)" class="btn btn-primary do-apply">申请贷款</a>&nbsp;
                        <input id="btnCancel" class="btn" type="button" value="返 回" onclick="history.go(-1)"/>
                </div>

            </div>
        </div>
        <div style="width: 400px;min-height: 100px;float: left;margin-left: 10px;padding: 5px" id="loanList">
        </div>
	</div>
    <div style="overflow: hidden;float:left">

        <div style="min-width: 700px;margin: 0 auto;text-align: center; border: 1px solid beige;" >
            <div style="overflow: hidden"><h1>【${member.username}】已上传的资料<span style="color: red">(*可根据客户所拥有的资料选择合适的产品)</span>：</h1>
                <div style="float: right">
                    <c:forEach var="type" items="${types}" varStatus="typeStatus">
                        <input type="button" class="btn btn-info btn_add"  data-id="${type.id}" value="添加${type.name}">
                    </c:forEach>
                </div>
            </div>
            <div id="material_upload" style="min-height: 400px;min-width: 800px;padding: 5px">

            </div>
        </div>
    </div>
</div>

<script type="text/template" id="apply_item">
   <%-- <div id="apply_item_box">
        <div> <label class="label-title">贷款客户：</label>	<label id="member_name"></label></div>
       <div><label class="label-title">贷款产品：</label>	<label class="label-text" id="loan_name" style="color: red"><span style="color: red">(*请选择贷款产品)</span></label></div>
        <div><label class="label-title">备注：</label>	<label class="label-text" id="remark"><input type="text" style="width: 120px" placeholder="备注说明" name="remarks" /></label></div>
        <div> <label class="label-title">贷款金额：</label> <input type="text" style="width: 100px" placeholder="单位（万元）" name="memberLoanLimit" /><span style="color: red">（*必填）</span></div>
       <div><a href="javascript:void(0)" class="btn btn-primary">申请贷款</a>&nbsp;</div>
    </div>--%>
</script>
</body>
</html>